<!--
 * @Author: your name
 * @Date: 2022-04-16 22:09:35
 * @LastEditTime: 2022-04-16 23:37:10
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \job-master\web\src\views\dashboard\components\JobsNumber.vue
-->
<!--
 * @Author: your name
 * @Date: 2022-04-16 22:11:27
 * @LastEditTime: 2022-04-16 23:11:03
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \job-master\web\src\views\dashboard\components\JobsRation.vue
-->

<template>
  <!--岗位数量变化情况  -->
  <div class="container">
    <div id="box4" class="echarts_container"></div>
  </div>
</template>

<script>
export default {
mounted() {
     // 基于准备好的dom，初始化echarts实例
    var myChart = this.$echarts.init(document.getElementById("box4"));
    //绘制图表
    myChart.setOption({
         title: {
    text: '岗位数量变化情况'
  },
  xAxis: {
    type: 'category',
    data:  ["广州", "深圳", "北京", "上海", "西安", "南京", "芜湖"]
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [150, 230, 224, 218, 135, 147, 260],
      type: 'line'
    }
  ]
})
  
}
}
</script>

<style lang="scss" scoped>
.container{
   .echarts_container{
    width: 830px;
    height: 410px;
  }
}
</style>